<template>
  <div class="page page-course-index p-5">
    即将开放，敬请期待
    <div class="line p-2 bg-white" v-if="false">
      <span class="label">提示词：</span>
      <textarea class="input bg-blue-100 px-1 w-100 h-50" placeholer="请输出提示词" v-model="prompt"></textarea>
      <div class="flex">
        <el-input v-model="genNum" placeholder="请输入内容"></el-input>
        <el-input v-model="seed" placeholder="请输入内容"></el-input>
        <el-input v-model="workflowId" placeholder="请输入内容"></el-input>
        <el-button @click="doTask">执行</el-button>

      </div>
    </div>
    <div class="tasks flex flex-wrap">
      <div class="task bg-blue-200  text-ellipsis   text-center " v-for="(task, index) in genPics " :key="index">
        <ComfyCptTaskItem :taskItem="task" />

      </div>

    </div>
  </div>
</template>
<script setup>
import { BASE_URL, postCheckPromptDetail, postSendDrawTask } from '../../service/yapi';
import ComfyCptTaskItem from '~/components/comfy/CptTaskItem.vue';

import async from "async";
definePageMeta({ auth: false });
let genNum = ref(20)
let workflowId = ref(3)
let seed = ref(100)

let taskList = computed(() => {
  return Array.from({ length: genNum.value }, (v, i) => {
    return {
      name: `任务${i + 1}`,
      prompt_id: "",
      status: {
        completed: false
      },
      info: ''
    }
  })
})

let genPics = ref([])
let prompt = ref('white background,solo,1 boy,bald,male focus,chibi,feathers,full body,black hair')
onMounted(() => {
  console.log('course page mounted')


})
let doTask = async () => {
  async.mapLimit(taskList.value, 1, async (t) => {
    let res = await postSendDrawTask({
      prompt: prompt.value,
      workflowId: workflowId.value,
      seed: seed.value
    })
    seed.value = seed.value + 1
    genPics.value.push({
      prompt_id: res.data.prompt_id,
    })
  })
}



</script>